<%@ page import="java.util.Map" %>
<%@ page import="cn.edu.dgut.Javabean_object.userinfo" %>
<%@ page import="cn.edu.dgut.function.readfile" %>
<%@ page import="java.io.FileReader" %>
<%@ page import="java.io.BufferedReader" %>
<%@ page import="javax.json.bind.Jsonb" %>
<%@ page import="javax.json.bind.JsonbBuilder" %>
<%@ page import="cn.edu.dgut.Javabean_object.register" %>
<%@ page import="javax.persistence.EntityManager" %>
<%@ page import="javax.persistence.Query" %>
<%@ page import="javax.persistence.Persistence" %>
<%@ page import="cn.edu.dgut.Javabean_object.Person" %>
<%@ page import="cn.edu.dgut.Javabean_object.Person2" %>
<%@ page import="java.util.HashMap" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2019/4/17 0017
  Time: 22:28
  To change this template use File | Settings | File Templates.
--%>
<%
    String pathname = "own.txt";
    FileReader reader = new FileReader(pathname);
    BufferedReader br = new BufferedReader(reader);
    String line=null;
    String KK=null;

    while ((line = br.readLine()) != null) {// 一次读入一行数据
        KK=line;

    }
%>
<html >
<head>
    <title>user-info</title>
    <meta charset="utf-8">
    <link rel="stylesheet" href="../CSS/style2.css" type="text/css" media="all" />
    <link rel="stylesheet" href="../CSS/bootstrap.css" type="text/css" media="all" />
    <script src="js/jquery.js"></script>
    <style>
        .noShow{
            display: none;
        }
        .noShower{
            display: none;
        }
    </style>
</head>
<body background="#666">
<div class="uploadImg-box">
    <img src="icon/x.png" id="aaaba">
    <h3>Change Avatar</h3>
    <div class="box-min">
        <form action="image" enctype="multipart/form-data" method="post">
            <div >
                <input id="lefile" type="file" style="display:none" name="headfile" >
                <div >
                    <input id="photoCover" style="width:250px" type="text"  name="headfileTemp">
                    <p   id="aaab" style="margin-top: 5px;width: 250px;height: 30px" onclick="$('input[id=lefile]').click();">Browse Locality</p>
                </div>
            </div>
            <div class="form-group" style="margin-top: 50px;">
                <button  id ="aaa" type="submit"  style="width: 250px;height: 30px" >FINISH</button>
            </div>
        </form>
    </div>
</div>
<%
    Map<String,String> infoMap = (Map<String, String>) request.getSession().getAttribute("Login");
    String user_number = infoMap.get("user_number");

    //根据工号查找用户表
    EntityManager em = (EntityManager) request.getAttribute("_entity.manager");
    Person user=em.find(Person.class,user_number);

%>

<div class="w3-banner-top">
    <div class="agileinfo-dot">
        <h3 style="margin-left: 200px"><a href="/logoutServlet"  id="out" style="float: right;margin-right: 475px ;margin-top:40px;color: #d9edf7; font-size:20px;font-family: Monospaced;">更换账号</a></h3>
        <div class="w3layouts_menu">
        </div>
        <div class="w3-banner-grids">
            <div class="col-md-6 w3-banner-grid-left">
                <div class="w3-banner-img">
                    <a href="#" id="headImg">   <img class="scaleStyle" src="img/<%=user.getHead_img()%>" alt="img"></a>
                    <div class="changeImg1 noShower">更换头像</div>
                    <h3 class="test">Cyberspace </h3>
                    <p class="test" >Software engineering</p>
                </div>
            </div>
            <div class="col-md-6 w3-banner-grid-right">
                <div class="w3-banner-text">
                    <h3 ><a href="#" id="kkkk" >Bio</a></h3>
                    <br>
                    <form id="ower" method="post" accept-charset="utf-8">
                        <input type="submit" id="pp" value=" OK " style="display: none;">
                    <p id="kkk"><%=KK%></p>
                    </form>
                </div>
                <div class=" w3-right-addres-1">
                    <form id="info-form" method="post">
                    <ul class="address">
                        <li>
                            <ul class="agileits-address-text ">
                                <li class="agile-it-adress-left"><b>Username</b></li><span  style="color: #d9edf7">:</span>
                                <li ><%=user.getUser_number()%></li>
                            </ul>
                        </li>

                        <li>
                            <ul class="agileits-address-text">
                                <li class="agile-it-adress-left"><b>E-MAIL</b></li><span  style="color: #d9edf7">:</span>
                                <li><a href="mailto:example@mail.com"><%=user.getEmail()%></a></li>
                            </ul>
                        </li>

                        <li>
                            <ul class="agileits-address-text">
                                <li class="agile-it-adress-left"><b>NAME</b></li>
                                <p class="noShow">name</p><span  style="color: #d9edf7">:</span>
                                <li class="input"><a href="#"><%=user.getName()%></a></li>
                            </ul>
                        </li>
                        <li>
                            <ul class="agileits-address-text">
                                <li class="agile-it-adress-left"><b>PHONE</b></li>
                                <p class="noShow">phone_number</p><span  style="color: #d9edf7">:</span>
                                <li class="input"><%=user.getPhone_number()%></li>
                            </ul>
                        </li>

                        <li>
                            <ul class="agileits-address-text">
                                <li class="agile-it-adress-left"><b>QQ</b></li>
                                <p class="noShow">qq</p><span  style="color: #d9edf7">:</span>
                                <li class="input"><%=user.getQq()%></li>
                            </ul>
                        </li>
                        <li>
                            <ul class="agileits-address-text">
                                <li class="agile-it-adress-left"><b>WECHAT</b></li>
                                <p class="noShow">weixin</p><span  style="color: #d9edf7">:</span>
                                <li class="input"><a href="#"><%=user.getWeixin()%></a></li>
                            </ul>
                        </li>
<%   if(user.getPerson2()!=null) {

%>
                        <li>
                            <ul class="agileits-address-text">
                                <li class="agile-it-adress-left"><b>FACULTY</b></li>
                                <p class="noShow">faculty_title</p><span  style="color: #d9edf7">:</span>
                                <li  class="input"><a href="https://lol.qq.com/"><%=user.getPerson2().getFaculty_title()%></a></li>
                            </ul>
                        </li>
                        <li>
                            <ul class="agileits-address-text">
                                <li class="agile-it-adress-left"><b>GROUP</b></li>
                                <p class="noShow">group</p><span  style="color: #d9edf7">:</span>
                                <li class="input"><a href="#"><%=user.getPerson2().getGrouped()%></a></li>
                            </ul>
                        </li>
<%                                 }

                     else{

%>
                        <p> <a href="/bindServlet">  点击关联莞工账号</a> </p>
 <%
     }
 %>
                    </ul>

                        <p id="form-button" style="display: none;">
                        <td align="center"><input type="submit" id="oo" value="保存"/></td>
                        <td align="center"><input type="reset" id="ll" value="取消"/></td>
                        </p>
                    </form>
                    <h3 style="margin-left: 200px"><a href="#"  id="changeInfo" style="color: #666666;font-size:20px;font-family: Monospaced;">编辑</a></h3>
                </div>
            </div>
            <div class="clearfix"></div>
        </div>
    </div>
</div>


</body>
</html>
<script>
    $(document).ready(function(){
        $(".scaleStyle").hover(
            function(){
                $(".changeImg1").removeClass("noShower");
            },function(){
                $(".changeImg1").addClass("noShower");
            }
        )

        $("#changeInfo").hover(
            function(){
                $(".changeImg1").removeClass("noShower");
            },function(){
                $(".changeImg1").addClass("noShower");
            }
        )
        //上传图片框
        $('input[id=lefile]').change(function() {
            $('#photoCover').val($(this).val());
        });
        //修改头像
        $("#headImg").click(function () {
            $(".uploadImg-box").show();
            $(".w3-banner-top").css("opacity","0.4");
            $(".uploadImg-box").css("opacity","1");
        });

        $(".uploadImg-box img").click(function () {
            $(".uploadImg-box").hide();
            $(".w3-banner-top").css("opacity","1");
        });
        //修改个人签名
        $("#kkkk").click(function () {
            $("#pp").show();
            $("#ower").attr("action","/own-Servlet");
            var save=$("#kkk");
            var text=save.text();
            var str = '<input style=" width: 400px;height:110px;  color: #262b31" type="text" name="own" value="">';
            save.html(str);
            }
        )
        //修改个人信息
        $("#changeInfo").click(function () {
            $("#info-form").attr("action","/saveServlet");
            $("#changeInfo").hide();
            $("#form-button").show();
            var input = $(".input");
            var len = input.length;
            for(var i=0;i<len;i++){
                var text = input.eq(i).text();
                var name = $(".noShow").eq(i).text();
                var str = '<input style="color: #262b31" type="text" name="'+name+'" value="'+text+'">';
                input.eq(i).html(str);
            }
        });
        //取消保存
        $("#ll").click(function () {
            window.location.reload();
        });
    });
</script>